<script setup lang="ts">
  import { ref, nextTick, computed } from "vue";
  import { onLoad } from '@dcloudio/uni-app';
  import GoodsItem from "@/components/GoodsItem.vue";
  import Dialog from "@/components/Dialog.vue";
  import { next } from "@/util";

  const list = ref<gt.sql.prizeGroup[]>([]),
    sx = ref(false),
    dig = ref<InstanceType<typeof Dialog>>({} as any),
    item = ref<gt.sql.prizeGroup>(),
    domain = ref(""),
    url = computed(() => {
      return item.value ? format.url(`/prize/${item.value.id}`) : "";
    })
    ;

  let c = 0, freshing = true;
  async function fetch() {
    if (freshing) {
      while (!api.mid) {
        await next();
      }
      const
        rule: gt.Rp<gt.sql.prizeGroup> = {
          "#page": { current: ++c, size: 10 }, "#order": [["createTime", "DESC"]], "#rule": [
            { field: "user", logic: "=", value: api.mid },
          ]
        },
        r = await gd.prizeGroup.read(rule);
      await Promise.all(r.data.map(async (e) => {
        e._prize = await gd.prize.getById(e.prize);
      }));
      if (c > 1) {
        list.value.push(...r.data);
      } else {
        list.value = r.data;
      }
      freshing = list.value.length < r.total;
    }
  }
  async function qr(p: gt.sql.prizeGroup) {
    if (!dig.value) {
      await nextTick();
      return;
    }
    await nextTick();
    if (p) {
      item.value = p;
      await dig.value.open({
        title: "中奖核销: " + item.value._prize.name, close() {
          item.value = undefined;
        },
      });
    }
  }
  async function init(q?: obj) {
    const d = await gd.setting.getById("domain");
    if (d) {
      domain.value = d.value;
    }
    sx.value = true;
    c = 0; freshing = true;
    await fetch();
    if (q && q.id) {
      const o = await gd.prizeGroup.getById(q.id);
      if (o) {
        o._prize = await gd.prize.getById(o.prize);
        qr(o);
      }
    }
    sx.value = false;
  }
  onLoad(init);
</script>
<template>
  <scroll-view class="whf oh" scroll-y refresher-enabled @scrolltolower="fetch" @refresherrefresh="init"
    :refresher-triggered="sx">
    <view class="prize whf y">
      <view class="item y wf" v-if="!!list.length">
        <view class="line wf mt1em bx pr xw zb" v-for="(i, ii) in list" :key="ii">
          <GoodsItem :modelValue="i._prize" row :class="i.cashTime > 0 ? 'cb' : 'cr'" />
          <view class="btns x">
            <view v-if="!!i.prizeGroup" class="btnc mac-ico-success" />
            <view v-else class="btnc mac-ico-qr" @click="qr(i)" />
          </view>
        </view>
      </view>
      <view v-else class="whf xcc non">没有记录,快去选购吧</view>
    </view>
    <Dialog ref="dig" title="标题" titleClass="xcc">
      <view class="xcc whf">
        <image :src="url" mode="aspectFit" />
      </view>
    </Dialog>
  </scroll-view>
</template>
<style lang="scss" scoped>
  .prize {
    position: relative;
    >.item {
      >.line {
        >.btns {
          position: absolute;
          top: 1.4em;
          right: 0.4em;
          >.mac-ico-success {
            color: $uni-color-success;
          }
          >.btnc {
            font-size: 1.4em;
            border: 1px solid $uni-text-color-grey;
            padding: 0.1em;
            border-radius: 0.2em;
          }
        }
      }
    }
  }
</style>